<!--
产品管理—主页
凌辉
2017-5-25
-->
<template>
  <el-tabs v-model="tabsCon" type="border-card" @tab-click="distinctiveDelay">
    <el-tab-pane label="基本信息">
      <config @saveNext="saveNext" :productIdConfig="productIdConfig" :pageType="pageType"/>
    </el-tab-pane>
    <el-tab-pane label="产品推荐" :disabled="distinctiveBol">
      <distinctive @saveNext="saveNext2" :productIdConfig="productId" v-if="distinctiveClick" :pageType="pageType"/>
    </el-tab-pane>
    <el-tab-pane label="参考行程" :disabled="routeBol">
      <route @saveNext="saveNext2" :productIdConfig="productId" v-if="routeClick" :pageType="pageType"/>
    </el-tab-pane>
    <el-tab-pane label="线路特色" :disabled="tourLineFeaturesBol">
      <tourLineFeatures @saveNext="saveNext2" :productIdConfig="productId" v-if="tourLineFeaturesClick"
                        :pageType="pageType"/>
    </el-tab-pane>
    <el-tab-pane label="费用说明" :disabled="feeInstructionsBol">
      <feeInstructions @saveNext="saveNext2" :productIdConfig="productId" v-if="feeInstructionsClick"
                       :pageType="pageType"/>
    </el-tab-pane>
    <el-tab-pane label="预订须知" :disabled="howBookBol">
      <howBook @saveNext="saveNext3" :productIdConfig="productId" v-if="howBookClick" :pageType="pageType"/>
    </el-tab-pane>
  </el-tabs>
</template>

<script type="text/ecmascript-6">
  import config from './config.vue'
  import distinctive from './distinctive.vue'
  import route from './route.vue'
  import feeInstructions from './feeInstructions.vue'
  import howBook from './howBook.vue'
  import priceInventory from './priceInventory.vue'
  import tourLineFeatures from './tourLineFeatures.vue'
  export default {
    props: {
      productIdConfig: {
        type: Number
      },
      pageType: {
        type: String
      }
    },
    data () {
      return {
        tabsCon: '',
        productId: 0,
        distinctiveBol: false,
        routeBol: false,
        tourLineFeaturesBol: false,
        feeInstructionsBol: false,
        howBookBol: false,
        distinctiveClick: false,
        routeClick: false,
        tourLineFeaturesClick: false,
        feeInstructionsClick: false,
        howBookClick: false
      }
    },
    methods: {
      distinctiveDelay () {
        if (this.tabsCon === '1') {
          this.distinctiveClick = true
        } else if (this.tabsCon === '2') {
          this.routeClick = true
        } else if (this.tabsCon === '3') {
          this.tourLineFeaturesClick = true
        } else if (this.tabsCon === '4') {
          this.feeInstructionsClick = true
        } else if (this.tabsCon === '5') {
          this.howBookClick = true
        }
      },
      saveNext (val, val2) {
        this.tabsCon = val
        this.productId = val2
        this.distinctiveBol = false
      },
      saveNext2 (val) {
        this.tabsCon = val
        if (val === '2') {
          this.routeBol = false
        } else if (val === '3') {
          this.tourLineFeaturesBol = false
        } else if (val === '4') {
          this.feeInstructionsBol = false
        } else if (val === '5') {
          this.howBookBol = false
        }
      },
      saveNext3 (val) {
        if (val === '0') {
          this.tabsCon = val
        } else {
          this.$emit('saveNext', '1', this.productId)
        }
      }
    },
    mounted () {
      if (this.productId <= 0 || this.productIdConfig === undefined) {
        this.distinctiveBol = true
        this.routeBol = true
        this.tourLineFeaturesBol = true
        this.feeInstructionsBol = true
        this.howBookBol = true
      }
    },
    beforeMount () {
      var user = sessionStorage.getItem('user')
      if (user) {
        this.productId = this.productIdConfig
      }
    },
    components: {
      config,
      distinctive,
      route,
      feeInstructions,
      howBook,
      priceInventory,
      tourLineFeatures
    }
  }
</script>

<style lang="stylus" rel="stylesheet/stylus">

</style>
